<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>

	<body>
		<div id="test">
			<!--<template v-if="0>1">
			  <h1>Title</h1>
			  <p>Paragraph 1</p>
			  <p>Paragraph 2</p>
			</template></h1>
			<div v-if="Math.random() > 0.5">
			  Sorry
			</div>
			<div v-else>
			  Not sorry
			</div>-->
			<!--else if-->
			<!--<div v-if="type === 'A'">
			  A
			</div>
			<div v-else-if="type === 'B'">
			  B
			</div>
			<div v-else-if="type === 'C'">
			  C
			</div>
			<div v-else>
			  Not A/B/C
			</div>-->
			<app></app>
		</div>

		<script type="text/x-template" id="tem_1">
			<h1>aaaaa</h1>
		</script>
		<script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
		<script src="http://cdn.bootcss.com/vue/2.1.10/vue.min.js"></script>

		<script type="text/javascript">
			Vue.component('app', {
				template: '#tem_1',
				data: {
					title: '我是頭部'
				}
			})

			var myVue = new Vue({
				el: "#test",
				data: {
					isDisplay: 1,
					type: 'A'
				}
			})
		</script>
	</body>

</html>